<template>
  <el-dialog title="选择角色标签" width="516px" class="gl_dialog_TitleLine" :close-on-click-modal="false" :visible.sync="inputVisible">
    <el-checkbox-group v-model="modelLgType">
      <el-row :gutter="20">
        <el-col v-for="item in registerTagType" :key="item.code" :span="6" class="gl_mb_15">
          <el-checkbox :label="item.code">{{ item.value }}</el-checkbox>
        </el-col>
      </el-row>
    </el-checkbox-group>
    <div slot="footer">
      <el-button size="mini" @click="inputVisible = false">取 消</el-button>
      <el-button size="mini" type="primary" :loading="chooseRoleLoading" :disabled="modelLgType.length === 0" @click="handleSubmitAddTag">确 定</el-button>
    </div>
  </el-dialog>
</template>
<script>
import { mapState } from 'vuex';
import {
  SiSTKWEventsManagementCreateRegisterTagInput
} from '@/lib/form/game/swaggerForm';
import {
  api_POST_EventsManagementRegisterTagTags
} from '@/extend/api/gameswaggerApi/app';
export default {
  data() {
    return {
      inputVisible: false,
      chooseRoleLoading: false,
      modelLgType: [],
      registerTagType: [],
      createRegisterTagInput: new SiSTKWEventsManagementCreateRegisterTagInput()
    };
  },
  computed: {
    ...mapState({
      dict: state => state.dict.dict,
      currentUserType: state => state.user.currentUserType
    })
  },
  methods: {
    open(tagList) {
      this.registerTagType = [];
      this.modelLgType = [];
      this.createRegisterTagInput = new SiSTKWEventsManagementCreateRegisterTagInput();
      this.showAddTagInput(tagList);
      this.inputVisible = true;
    },
    close() {
      this.inputVisible = false;
    },
    handleSubmitAddTag() {
      const tags = [];
      if (this.modelLgType.length > 0) {
        for (let i = 0; i < this.modelLgType.length; i++) {
          tags.push({
            registerId: this.currentUserType.registerId,
            registerTagTypeCode: this.modelLgType[i]
          });
        }
        this.createRegisterTagInput.tags = tags;
        this.chooseRoleLoading = true;
        api_POST_EventsManagementRegisterTagTags(this.createRegisterTagInput).then(res => {
          this.chooseRoleLoading = false;
          this.$emit('refreshPage');
          this.$message({ type: 'success', message: '操作成功' });
          this.inputVisible = false;
        }, error => {
          this.chooseRoleLoading = false;
          this.$message({ type: 'error', message: (error.error && error.error.message || '操作失败') });
        });
      }
    },
    showAddTagInput(tagList) {
      const _dynamicTags = tagList.map(
        item => item.registerTagTypeCode
      );
      console.log(tagList);
      this.registerTagType = this.dict.registerTagType.filter(item => !_dynamicTags.includes(item.code));
    }
  }
};
</script>
